<template>
	<view class="page">
		
		
		<view class="items" @click="changeUnit">
			<view class="left">
				<view class="type md4Text lgrey">
					添加工作经历
				</view>
				
				<view class="name  md2Title mgrey">
					<input type="text" value="" placeholder="公司名称请输入"/>
				</view>
			</view>
			
			<view class="right">
				<image src="../../../static/imgs/right.png" mode=""></image>
			</view>
		</view>
		
		<view class="items" @click="goOnIndustry">
			<view class="left">
				<view class="type md4Text lgrey">
					所在行业请选择
				</view>
				
				<view class="name  md2Title mgrey">
					<input type="text" value="" placeholder="请选择"/>
				</view>
			</view>
			
			<view class="right">
				<image src="../../../static/imgs/right.png" mode=""></image>
			</view>
		</view>
		
		<view class="items">
			<view class="left">
				<view class="type md4Text lgrey">
					在职时间
				</view>
				
				<view class="name  md2Title mgrey" style="display: flex;">
					<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
					    <view class="uni-input">{{date}}</view>
					</picker>
					
					<text style="padding-left: 200upx;color: #333;">——至今</text>
				</view>
			</view>
			
			<view class="right">
				<image src="../../../static/imgs/right.png" mode=""></image>
			</view>
		</view>
		
		
		
		<view class="items" @click="goSetJob">
			<view class="left">
				<view class="type md4Text lgrey">
					职位名称
				</view>
				
				<view class="name  md2Title mgrey">
					请选择 
				</view>
			</view>
			
			<view class="right">
				<image src="../../../static/imgs/right.png" mode=""></image>
			</view>
		</view>
		
		<view class="items" @click="goWorkContent">
			<view class="left">
				<view class="type md4Text lgrey">
					工作内容
				</view>
				
				<view class="name  md2Title mgrey">
					请输入
				</view>
			</view>
			
			<view class="right">
				<image src="../../../static/imgs/right.png" mode=""></image>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		 const currentDate = this.getDate({
		            format: true
		        })
		return {
			date: currentDate,
		};
	},
	
	computed: {
	        startDate() {
	            return this.getDate('start');
	        },
	        endDate() {
	            return this.getDate('end');
	        }
	    },

	methods: {
		
		 getDate(type) {
		            const date = new Date();
		            let year = date.getFullYear();
		            let month = date.getMonth() + 1;
		            let day = date.getDate();
		
		            if (type === 'start') {
		                year = year - 60;
		            } else if (type === 'end') {
		                year = year + 2;
		            }
		            month = month > 9 ? month : '0' + month;
		            day = day > 9 ? day : '0' + day;
		            return `${year}-${month}-${day}`;
		        },
				
		changeUnit(){
			uni.navigateTo({
				url:'/pages/views/mine/unitName'
			})
		},
		
		goOnIndustry(){
			uni.navigateTo({
				url:'/pages/views/mine/onIndustry'
			})
		},
		goSetJob(){
		  uni.navigateTo({
		  	url:'/pages/views/mine/setJob'
		  })
		},
		goWorkContent(){
			uni.navigateTo({
				url:'/pages/views/mine/workContent'
			})
		}
		
	}
};
</script>

<style scoped lang="less">
	.page{
		border-top: 2upx solid #e5e5e5;
		padding: 0 32upx;
		.items{
			width: 100%;
			height: 156upx;
			border-bottom: 2upx solid #e5e5e5;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 0 20upx;
			.photo{
				image{
					width: 112upx;
					height: 112upx;
				}
			}
			.left{
				.name{
					font-weight: bold;
					margin-top: 30upx;
					
				}
			}
			.right{
				image{
					width: 48upx;
					height: 48upx;
				}
			}
		}
	}
</style>
